<html lang="en">
<head><!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="description" content="Responsive Bootstrap 4 Admin &amp; Dashboard Template">
    <meta name="author" content="Bdtask">
    <title>Bhulua - Bootstrap 4 Admin Template Deshboard</title><!-- App favicon -->
    <link rel="shortcut icon" href="${base}/formal/assets/dist/img/favicon.cvo"><!--Global Styles(used by all pages)-->
    <link href="${base}/formal/lib/bootstrap3.3.7/css/bootstrap.min.css" rel="stylesheet">
    <link href="${base}/formal/lib/bootstrap3.3.7/css/bootstrap33.7.min.css" rel="stylesheet">
    <link href="${base}/formal/assets/plugins/metisMenu/metisMenu.min.css" rel="stylesheet">
    <link href="${base}/formal/assets/plugins/typicons/typicons.min.css" rel="stylesheet">
    <link href="${base}/formal/assets/plugins/themify-icons/themify-icons.min.css" rel="stylesheet">
    <link href="${base}/formal/lib/bootstrap3.3.7/css/font-awesome.min.css"
          rel="stylesheet" />
    <link href="${base}/formal/lib/jquery1.11/ztree/css/bootstrapStyle/bootstrapStyle.css"
          rel="stylesheet">
    <link href="${base}/formal/lib/bootstrap-select3/css/bootstrap-select.min.css"
          rel="stylesheet">
    <link href="${base}/formal/assets/dist/css/style.css" rel="stylesheet">
    <style type="text/css">
        .jqstooltip {
        position: absolute;
        left: 0px;
        top: 0px;
        visibility: hidden;
        background: rgb(0, 0, 0) transparent;
        background-color: rgba(0, 0, 0, 0.6);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000);
        -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000)";
        color: white;
        font: 10px arial, san serif;
        text-align: left;
        white-space: nowrap;
        padding: 5px;
        border: 1px solid white;
        z-index: 10000;
    }

    .jqsfield {
        color: white;
        font: 10px arial, san serif;
        text-align: left;
    }</style>
    <style type="text/css">/* Chart.js */
    @keyframes chartjs-render-animation {
        from {
            opacity: .99
        }
        to {
            opacity: 1
        }
    }

    .chartjs-render-monitor {
        animation: chartjs-render-animation 1ms
    }

    .chartjs-size-monitor, .chartjs-size-monitor-expand, .chartjs-size-monitor-shrink {
        position: absolute;
        direction: ltr;
        left: 0;
        top: 0;
        right: 0;
        bottom: 0;
        overflow: hidden;
        pointer-events: none;
        visibility: hidden;
        z-index: -1
    }

    .chartjs-size-monitor-expand > div {
        position: absolute;
        width: 1000000px;
        height: 1000000px;
        left: 0;
        top: 0
    }

    .chartjs-size-monitor-shrink > div {
        position: absolute;
        width: 200%;
        height: 200%;
        left: 0;
        top: 0
    }</style>
</head>
<body class="fixed"><!-- Page Loader -->
<div class="page-loader-wrapper" style="display: none;">
    <div class="loader">
        <div class="preloader">
            <div class="spinner-layer pl-green">
                <div class="circle-clipper left">
                    <div class="circle"></div>
                </div>
                <div class="circle-clipper right">
                    <div class="circle"></div>
                </div>
            </div>
        </div>
        <p>Please wait...</p></div>
</div><!-- #END# Page Loader -->
<div class="wrapper"><!-- Sidebar  -->
    <nav class="sidebar sidebar-bunker">
        <div class="sidebar-header"><!--<a href="index.html" class="logo"><span>bd</span>task</a>--> <a
                href="index.html" class="logo"><img src="${base}/formal/assets/dist/img/logo.png" alt=""></a></div>
        <!--/.sidebar header-->
        <div class="profile-element d-flex align-items-center flex-shrink-0">
            <div class="avatar online"><img src="${base}/formal/assets/dist/img/face.png" class="img-fluid rounded-circle" alt="">
            </div>
            <div class="profile-text"><h6 class="m-0">${userName?default('薛 佳 琪')}</h6><span>
                <a href="" class="__cf_email__">[email&nbsp;protected]</a></span>
            </div>
        </div><!--/.profile element-->
        <form class="search sidebar-form" action="#" method="get">
            <div class="search__inner"><input type="text" class="search__text" placeholder="Search..."><i
                    class="typcn typcn-zoom-outline search__helper" data-sa-action="search-close"></i></div>
        </form><!--/.search-->
        <div class="sidebar-body ps ps--active-y">
            <nav class="sidebar-nav">
                <ul class="metismenu" id="side-menu">
                    <li class="mm-active" style="cursor: pointer">
                        <a class="material-ripple" href="#" aria-expanded="true">
                            <i class="typcn typcn-home-outline mr-2"></i>控制台
                        </a>
                    </li>
                    <#if resources??>
                    <#macro bpTree children>
                    <#if children?? && children?size gt 0>
                    <#list children as child>
                    <#if child.children??&&child.children?size gt 0>
                    <li style="cursor: pointer">
                        <a class="has-arrow material-ripple" href="#" data-id="${child.id}">
                            <i class="typcn typcn-chart-pie-outline mr-2"></i>
                            ${child.menuName!}</a>
                        <ul class="nav-second-level mm-collapse">
                            <@bpTree children=child.children />
                        </ul>
                    </li>
                    <#else>
                    <li style="cursor: pointer">
                        <a class="material-ripple" href="#" data-id="${child.id}">
                            <i class="typcn typcn-chart-pie-outline mr-2"></i>
                            ${child.menuName!}</a>
                    </li>
                    </#if>
                    </#list>
                    </#if>
                </#macro>
                <@bpTree children=resources />
                </#if>
            </ul>
            </nav>
            <div class="ps__rail-x" style="left: 0px; top: 0px;">
                <div class="ps__thumb-x" tabindex="0" style="left: 0px; width: 0px;"></div>
            </div>
            <div class="ps__rail-y" style="top: 0px; height: 498px; right: 0px;">
                <div class="ps__thumb-y" tabindex="0" style="top: 0px; height: 62px;"></div>
            </div>
        </div><!-- sidebar-body --></nav><!-- Page Content  -->
    <div class="content-wrapper">
        <div class="main-content">
            <nav class="navbar-custom-menu navbar navbar-expand-lg m-0">
                <div class="sidebar-toggle-icon" id="sidebarCollapse"> sidebar toggle<span></span></div>
                <!--/.sidebar toggle icon-->
                <div class="d-flex flex-grow-1">
                    <ul class="navbar-nav flex-row align-items-center ml-auto">
                        <li class="nav-item dropdown user-menu">
                            <a class="nav-link dropdown-toggle" href="#" data-toggle="dropdown">
                                <i
                                class="typcn typcn-user-add-outline"></i></a>
                            <div class="dropdown-menu dropdown-menu-right">
                                <div class="dropdown-header d-sm-none"><a href="" class="header-arrow"><i
                                        class="icon ion-md-arrow-back"></i></a></div>
                                <div class="user-header">
                                    <div class="img-user"><img src="${base}/formal/assets/dist/img/face.png" alt=""></div>
                                    <!-- img-user --><h6>${userName?default('薛 佳 琪')}</h6><span>
                                    <a href="" class="__cf_email__">[email&nbsp;protected]</a></span>
                                </div><!-- user-header --><a href="" class="dropdown-item"><i
                                    class="typcn typcn-user-outline"></i>我的个人资料</a><a href="" class="dropdown-item"><i
                                    class="typcn typcn-edit"></i>编辑个人资料</a><a href="" class="dropdown-item"><i
                                    class="typcn typcn-arrow-shuffle"></i>活动记录</a><a href="" class="dropdown-item"><i
                                    class="typcn typcn-key-outline"></i>登出</a></div></li>
                    </ul><!--/.navbar nav-->
                    <div class="nav-clock">
                        <div class="time"><span class="time-hours">11</span><span class="time-min">50</span><span
                                class="time-sec">59</span></div>
                    </div><!-- nav-clock --></div>
            </nav>
            <div class="body-content" id="formal-body-content">
                <div class="row">
                    <div class="col-lg-12">
                        <div class="row">
                            <div class="col-md-3 col-lg-3">
                                <div class="p-2 bg-white rounded p-3 mb-3 shadow-sm">
                                    <div class="header-pretitle text-muted fs-11 font-weight-bold text-uppercase mb-2">
                                        今天的收入
                                    </div>
                                    <div class="badge badge-success fs-26 text-monospace mx-auto">¥98<span
                                            class="opacity-50 small">.50</span></div>
                                    <div class="text-muted small mt-1"><span class="text-danger"><i
                                            class="fas fa fa-long-arrow-alt-down"></i>                                                    5%                                                 </span>vs
                                       平均
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-3 col-lg-3"><!--Revenue today indicator-->
                                <div class="p-2 bg-white rounded p-3 mb-3 shadow-sm">
                                    <div class="header-pretitle text-muted fs-11 font-weight-bold text-uppercase mb-2">
                                        今天的收入
                                    </div>
                                    <div class="badge badge-success fs-26 text-monospace mx-auto">$98<span
                                            class="opacity-50 small">.50</span></div>
                                    <div class="text-muted small mt-1"><span class="text-danger"><i
                                            class="fas fa fa-long-arrow-alt-down"></i>                                                    5%                                                 </span>vs
                                        平均
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-3 col-lg-3"><!--Revenue today indicator-->
                                <div class="p-2 bg-white rounded p-3 mb-3 shadow-sm">
                                    <div class="header-pretitle text-muted fs-11 font-weight-bold text-uppercase mb-2">
                                        今天的收入
                                    </div>
                                    <div class="badge badge-success fs-26 text-monospace mx-auto">$98<span
                                            class="opacity-50 small">.50</span></div>
                                    <div class="text-muted small mt-1"><span class="text-danger"><i
                                            class="fas fa fa-long-arrow-alt-down"></i>                                                    5%                                                 </span>vs
                                        平均
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-3 col-lg-3"><!--Revenue today indicator-->
                                <div class="p-2 bg-white rounded p-3 mb-3 shadow-sm">
                                    <div class="header-pretitle text-muted fs-11 font-weight-bold text-uppercase mb-2">
                                        今天的收入
                                    </div>
                                    <div class="badge badge-success fs-26 text-monospace mx-auto">$98<span
                                            class="opacity-50 small">.50</span></div>
                                    <div class="text-muted small mt-1"><span class="text-danger"><i
                                            class="fas fa fa-long-arrow-alt-down"></i>                                                    5%                                                 </span>vs
                                        平均
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-12 col-lg-12 col-xl-3 mb-4">
                        <div class="card">
                            <div class="card-header">
                                <div class="d-flex justify-content-between align-items-center">
                                    <div><h6 class="fs-17 font-weight-600 mb-0">会员主要来源</h6></div>
                                    <div class="text-right">
                                        <div class="actions"><a href="#" class="action-item"><i
                                                class="ti-reload"></i></a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="card-body">
                                <div class="chart mb-3">
                                    <div class="chartjs-size-monitor">
                                        <div class="chartjs-size-monitor-expand">
                                            <div class=""></div>
                                        </div>
                                        <div class="chartjs-size-monitor-shrink">
                                            <div class=""></div>
                                        </div>
                                    </div>
                                    <canvas id="doughutChart" height="221"
                                            style="display: block; width: 214px; height: 221px;" width="214"
                                            class="chartjs-render-monitor"></canvas>
                                </div>
                                <div class="chart-legend">
                                    <div class="chart-legend-item">
                                        <div class="chart-legend-color kelly-green"></div>
                                        <p>会员介绍</p>
                                        <p class="percentage text-muted">63.259 %</p></div>
                                    <div class="chart-legend-item">
                                        <div class="chart-legend-color kelly-green2"></div>
                                        <p>大众美团</p>
                                        <p class="percentage text-muted">13.321 %</p></div>
                                    <div class="chart-legend-item">
                                        <div class="chart-legend-color whisper"></div>
                                        <p>外派传单</p>
                                        <p class="percentage text-muted">11.42 %</p></div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-12 col-lg-12 col-xl-9">
                        <div class="card mb-4">
                            <div class="card-header"><h2 class="fs-18 font-weight-bold mb-0">每月收入情况</h2></div>
                            <div class="card-body">
                                <div class="chartjs-size-monitor">
                                    <div class="chartjs-size-monitor-expand">
                                        <div class=""></div>
                                    </div>
                                    <div class="chartjs-size-monitor-shrink">
                                        <div class=""></div>
                                    </div>
                                </div>
                                <canvas id="barChart" height="332" width="779" class="chartjs-render-monitor"
                                        style="display: block; width: 779px; height: 332px;"></canvas>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="overlay"></div>
    </div>
</div>
<script data-main="${base}/formal/main.js" async="true"
        src="${base}/formal/require.js"></script>
<div id="toTop" class="btn-top"><i class="typcn typcn-arrow-up fs-21"></i></div>
</body>
</html>